<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Colorschemes Syntax highlighting for Prism</title>

    <link href="../assets/css/screen.css" media="screen, projection" rel="stylesheet" type="text/css" />
    <link href="../assets/css/app.css" media="screen, projection" rel="stylesheet" type="text/css" />
   <style>
.red-background{background-color:#d73737}
.orange-background{background-color:#b65611}
.yellow-background{background-color:#cfb017}
.green-background{background-color:#60ac39}
.cyan-background{background-color:#1fad83}
.blue-background{background-color:#6684e1}
.violet-background{background-color:#b854d4}
.magenta-background{background-color:#d43552}
    </style>


    <!--[if IE]>
    <link href="../assets/css/ie.css" media="screen, projection" rel="stylesheet" type="text/css" />
    <![endif]-->

    <link rel="stylesheet" href="../assets/css/app.css" />
    <link rel="stylesheet" href="../assets/css/prism/prism.css" id="stylesheet--code" />


    <meta name="viewport" content="width=device-width">
    <meta name="author" content="Bram de Haan">
    <meta name="robots" content="index, follow">  <meta name="description" content="Colection of colorschemes for Code Syntax highlighting"/>
    <link rel="author" href="https://plus.google.com/+BramdeHaan/posts">
  </head>

  <body class="sh-prism">
    <!-- Header and Nav -->
    <header id="header" class="row header">
    <div class="large-4 columns">
      <h1 class="repo-title"><a href="http://atelierbram.github.io/syntax-highlighting/">Syntax Highlighting <span class="tagline sh-small">colorschemes</span></a></h1>

    </div>
    <nav class="large-8 columns ">
    <ul class="inline-list right">
       <li><a href="../chrome-devtools">Chrome DevTools</a></li>
       <li><a href="../lab">Lab</a></li>
       <li><a href="../duotones">Duotones</a></li>
       <li><a href="../atelier-schemes/" data-dropdown="drop-atelierschemes" class="button dropdown dropdown-atelier">Atelier Schemes<span data-dropdown="drop-atelierschemes"></span></a><br>
          <ul id="drop-atelierschemes" class="f-dropdown small" data-dropdown-content>
            <li><a href="../atelier-schemes">index - overview</a></li>
            <li><a href="../atelier-schemes/forest">Forest</a></li>
            <li><a href="../atelier-schemes/plateau">Plateau</a></li>
            <li><a href="../atelier-schemes/heath">Heath</a></li>
            <li><a href="../atelier-schemes/cave">Cave</a></li>
            <li><a href="../atelier-schemes/sulphurpool">Sulphurpool</a></li>
            <li><a href="../atelier-schemes/lakeside">Lakeside</a></li>
            <li><a href="../atelier-schemes/savanna">Savanna</a></li>
            <li><a href="../atelier-schemes/seaside">Seaside</a></li>
            <li><a href="../atelier-schemes/estuary">Estuary</a></li>
            <li><a href="../atelier-schemes/dune">Dune</a></li>
            <li><a href="../atelier-schemes/output">Output</a></li>
          </ul>
          </li>
        </ul>
      </nav>
    </header>

    <!-- End Header and Nav -->
    <div class="row outer-wrap">
      <div class="line styleswitchers">
        <!-- <div class="row">  -->

        <div class="large-4 push-7 columns">
          <a href="#" data-dropdown="drop1" class="button dropdown medium">colorschemes<span data-dropdown="drop1"></span></a><br>

          <ul id="drop1" class="f-dropdown small" data-dropdown-content>
            <li><a class="styleswitch code-default" href="?prism" title="code-default">Light (default)</a></li>
            <li><a class="styleswitch code-dark" href="?prism-dark" title="code-dark">Dark</a></li>
            <li><a class="styleswitch code-funky" href="?prism-funky" title="code-funky">Funky</a></li>
            <li><a class="styleswitch code-okaidia" href="?prism-okaidia" title="code-okaidia">Okaidia</a></li>
            <li><a class="styleswitch code-twilight" href="?prism-twilight" title="code-twilight">Twilight</a></li>
            <li><a class="styleswitch code-tomorrow" href="?prism-tomorrow" title="code-tomorrow">Tomorrow</a></li>
            <li><a class="styleswitch code-xonokai" href="?prism-xonokai" title="code-xonokai">Xonokai</a></li>
            <li><a class="styleswitch code-cbavota" href="?prism-cbavota" title="code-cbavota">CB</a></li>
            <li><a class="styleswitch code-pojoaque" href="?prism-pojoaque" title="code-pojoaque">Pojoaque</a></li>

            <li><a class="styleswitch code-base16-3024-light" href="?prism-base16-3024.light.css" title="code-base16-3024-light">Base16-3024-light</a></li>
            <li><a class="styleswitch code-base16-3024-dark" href="?prism-base16-3024.dark.css" title="code-base16-3024-dark">Base16-3024-dark</a></li>
            <li><a class="styleswitch code-base16-apathy-light" href="?prism-base16-apathy.light.css" title="code-base16-apathy-light">Base16-Apathy-light</a></li>
            <li><a class="styleswitch code-base16-apathy-dark" href="?prism-base16-apathy.dark.css" title="code-base16-apathy-dark">Base16-Apathy-dark</a></li>
            <li><a class="styleswitch code-base16-ashes-light" href="?prism-base16-ashes.light.css" title="code-base16-ashes-light">Base16-Ashes-light</a></li>
            <li><a class="styleswitch code-base16-ashes-dark" href="?prism-base16-ashes.dark.css" title="code-base16-ashes-dark">Base16-Ashes-dark</a></li>
            <li><a class="styleswitch code-base16-atelierforest-light" href="?prism-base16-atelierforest-light" title="code-base16-atelier-forest-light">Base16-Atelier-Forest-light</a></li>
            <li><a class="styleswitch code-base16-atelierforest-dark" href="?prism-base16-atelierforest-dark" title="code-base16-atelier-forest-dark">Base16-Atelier-Forest-dark</a></li>
            <li><a class="styleswitch code-base16-atelierplateau-light" href="?prism-base16-atelierplateau-light" title="code-base16-atelier-plateau-light">Base16-Atelier-Plateau-light</a></li>
            <li><a class="styleswitch code-base16-atelierplateau-dark" href="?prism-base16-atelierplateau-dark" title="code-base16-atelier-plateau-dark">Base16-Atelier-Plateau-dark</a></li>
            <li><a class="styleswitch code-base16-atelierheath-light" href="?prism-base16-atelierheath-light" title="code-base16-atelier-heath-light">Base16-Atelier-Heath-light</a></li>
            <li><a class="styleswitch code-base16-atelierheath-dark" href="?prism-base16-atelierheath-dark" title="code-base16-atelier-heath-dark">Base16-Atelier-Heath-dark</a></li>
            <li><a class="styleswitch code-base16-ateliercave-light" href="?prism-base16-ateliercave-light" title="code-base16-atelier-cave-light">Base16-Atelier-Cave-light</a></li>
            <li><a class="styleswitch code-base16-ateliercave-dark" href="?prism-base16-ateliercave-dark" title="code-base16-atelier-cave-dark">Base16-Atelier-Cave-dark</a></li>
            <li><a class="styleswitch code-base16-ateliersulphurpool-light" href="?prism-base16-ateliersulphurpool-light" title="code-base16-atelier-sulphurpool-light">Base16-Atelier-Sulphurpool-light</a></li>
            <li><a class="styleswitch code-base16-ateliersulphurpool-dark" href="?prism-base16-ateliersulphurpool-dark" title="code-base16-atelier-sulphurpool-dark">Base16-Atelier-Sulphurpool-dark</a></li>
            <li><a class="styleswitch code-base16-atelierlakeside-light" href="?prism-base16-atelierlakeside-light" title="code-base16-atelier-lakeside-light">Base16-Atelier-Lakeside-light</a></li>
            <li><a class="styleswitch code-base16-atelierlakeside-dark" href="?prism-base16-atelierlakeside-dark" title="code-base16-atelier-lakeside-dark">Base16-Atelier-Lakeside-dark</a></li>
            <li><a class="styleswitch code-base16-ateliersavanna-light" href="?prism-base16-ateliersavanna-light" title="code-base16-atelier-savanna-light">Base16-Atelier-Savanna-light</a></li>
            <li><a class="styleswitch code-base16-ateliersavanna-dark" href="?prism-base16-ateliersavanna-dark" title="code-base16-atelier-savanna-dark">Base16-Atelier-Savanna-dark</a></li>
            <li><a class="styleswitch code-base16-atelierseaside-light" href="?prism-base16-atelierseaside-light" title="code-base16-atelier-seaside-light">Base16-Atelier-Seaside-light</a></li>
            <li><a class="styleswitch code-base16-atelierseaside-dark" href="?prism-base16-atelierseaside-dark" title="code-base16-atelier-seaside-dark">Base16-Atelier-Seaside-dark</a></li>
            <li><a class="styleswitch code-base16-atelierestuary-light" href="?prism-base16-atelierestuary-light" title="code-base16-atelier-estuary-light">Base16-Atelier-Estuary-light</a></li>
            <li><a class="styleswitch code-base16-atelierestuary-dark" href="?prism-base16-atelierestuary-dark" title="code-base16-atelier-estuary-dark">Base16-Atelier-Estuary-dark</a></li>
            <li><a class="styleswitch code-base16-atelierdune-light" href="?prism-base16-atelierdune-light" title="code-base16-atelier-dune-light">Base16-Atelier-Dune-light</a></li>
            <li><a class="styleswitch code-base16-atelierdune-dark" href="?prism-base16-atelierdune-dark" title="code-base16-atelier-dune-dark">Base16-Atelier-Dune-dark</a></li>
            <li><a class="styleswitch code-base16-bespin-light" href="?prism-base16-bespin.light.css" title="code-base16-bespin-light">Base16-Bespin-light</a></li>
            <li><a class="styleswitch code-base16-bespin-dark" href="?prism-base16-bespin.dark.css" title="code-base16-bespin-dark">Base16-Bespin-dark</a></li>
            <li><a class="styleswitch code-base16-brewer-light" href="?prism-base16-brewer.light.css" title="code-base16-brewer-light">Base16-Brewer-light</a></li>
            <li><a class="styleswitch code-base16-brewer-dark" href="?prism-base16-brewer.dark.css" title="code-base16-brewer-dark">Base16-Brewer-dark</a></li>
            <li><a class="styleswitch code-base16-bright-light" href="?prism-base16-bright.light.css" title="code-base16-bright-light">Base16-Bright-light</a></li>
            <li><a class="styleswitch code-base16-bright-dark" href="?prism-base16-bright.dark.css" title="code-base16-bright-dark">Base16-Bright-dark</a></li>
            <li><a class="styleswitch code-base16-chalk-light" href="?prism-base16-chalk.light.css" title="code-base16-chalk-light">Base16-Chalk-light</a></li>
            <li><a class="styleswitch code-base16-chalk-dark" href="?prism-base16-chalk.dark.css" title="code-base16-chalk-dark">Base16-Chalk-dark</a></li>
            <li><a class="styleswitch code-base16-codeschool-light" href="?prism-base16-codeschool.light.css" title="code-base16-codeschool-light">Base16-Codeschool-light</a></li>
            <li><a class="styleswitch code-base16-codeschool-dark" href="?prism-base16-codeschool.dark.css" title="code-base16-codeschool-dark">Base16-Codeschool-dark</a></li>
            <li><a class="styleswitch code-base16-colors-light" href="?prism-base16-colors.light.css" title="code-base16-colors-light">Base16-Colors-light</a></li>
            <li><a class="styleswitch code-base16-colors-dark" href="?prism-base16-colors.dark.css" title="code-base16-colors-dark">Base16-Colors-dark</a></li>
            <li><a class="styleswitch code-base16-default-light" href="?prism-base16-default.light.css" title="code-base16-default-light">Base16-Default-light</a></li>
            <li><a class="styleswitch code-base16-default-dark" href="?prism-base16-default.dark.css" title="code-base16-default-dark">Base16-Default-dark</a></li>
            <li><a class="styleswitch code-base16-eighties-light" href="?prism-base16-eighties.light.css" title="code-base16-eighties-light">Base16-Eighties-light</a></li>
            <li><a class="styleswitch code-base16-eighties-dark" href="?prism-base16-eighties.dark.css" title="code-base16-eighties-dark">Base16-Eighties-dark</a></li>
            <li><a class="styleswitch code-base16-embers-light" href="?prism-base16-embers.light.css" title="code-base16-embers-light">Base16-Embers-light</a></li>
            <li><a class="styleswitch code-base16-embers-dark" href="?prism-base16-embers.dark.css" title="code-base16-embers-dark">Base16-Embers-dark</a></li>
            <li><a class="styleswitch code-base16-flat-light" href="?prism-base16-flat.light.css" title="code-base16-flat-light">Base16-Flat-light</a></li>
            <li><a class="styleswitch code-base16-flat-dark" href="?prism-base16-flat.dark.css" title="code-base16-flat-dark">Base16-Flat-dark</a></li>
            <li><a class="styleswitch code-base16-google-light" href="?prism-base16-google.light.css" title="code-base16-google-light">Base16-Google-light</a></li>
            <li><a class="styleswitch code-base16-google-dark" href="?prism-base16-google.dark.css" title="code-base16-google-dark">Base16-Google-dark</a></li>
            <li><a class="styleswitch code-base16-grayscale-light" href="?prism-base16-grayscale.light.css" title="code-base16-grayscale-light">Base16-Grayscale-light</a></li>
            <li><a class="styleswitch code-base16-grayscale-dark" href="?prism-base16-grayscale.dark.css" title="code-base16-grayscale-dark">Base16-Grayscale-dark</a></li>
            <li><a class="styleswitch code-base16-greenscreen-light" href="?prism-base16-greenscreen.light.css" title="code-base16-greenscreen-light">Base16-Greenscreen-light</a></li>
            <li><a class="styleswitch code-base16-greenscreen-dark" href="?prism-base16-greenscreen.dark.css" title="code-base16-greenscreen-dark">Base16-Greenscreen-dark</a></li>
            <li><a class="styleswitch code-base16-harmonic16-light" href="?prism-base16-harmonic16.light.css" title="code-base16-harmonic16-light">Base16-Harmonic16-light</a></li>
            <li><a class="styleswitch code-base16-harmonic16-dark" href="?prism-base16-harmonic16.dark.css" title="code-base16-harmonic16-dark">Base16-Harmonic16-dark</a></li>
            <li><a class="styleswitch code-base16-hopscotch-light" href="?prism-base16-hopscotch.light.css" title="code-base16-hopscotch-light">Base16-Hopscotch-light</a></li>
            <li><a class="styleswitch code-base16-hopscotch-dark" href="?prism-base16-hopscotch.dark.css" title="code-base16-hopscotch-dark">Base16-Hopscotch-dark</a></li>
            <li><a class="styleswitch code-base16-isotope-light" href="?prism-base16-isotope.light.css" title="code-base16-isotope-light">Base16-Isotope-light</a></li>
            <li><a class="styleswitch code-base16-isotope-dark" href="?prism-base16-isotope.dark.css" title="code-base16-isotope-dark">Base16-Isotope-dark</a></li>
            <li><a class="styleswitch code-base16-marrakesh-light" href="?prism-base16-marrakesh.light.css" title="code-base16-marrakesh-light">Base16-Marrakesh-light</a></li>
            <li><a class="styleswitch code-base16-marrakesh-dark" href="?prism-base16-marrakesh.dark.css" title="code-base16-marrakesh-dark">Base16-Marrakesh-dark</a></li>
            <li><a class="styleswitch code-base16-mocha-light" href="?prism-base16-mocha.light.css" title="code-base16-mocha-light">Base16-Mocha-light</a></li>
            <li><a class="styleswitch code-base16-mocha-dark" href="?prism-base16-mocha.dark.css" title="code-base16-mocha-dark">Base16-Mocha-dark</a></li>
            <li><a class="styleswitch code-base16-monokai-light" href="?prism-base16-monokai.light.css" title="code-base16-monokai-light">Base16-Monokai-light</a></li>
            <li><a class="styleswitch code-base16-monokai-dark" href="?prism-base16-monokai.dark.css" title="code-base16-monokai-dark">Base16-Monokai-dark</a></li>
            <li><a class="styleswitch code-base16-ocean-light" href="?prism-base16-ocean.light.css" title="code-base16-ocean-light">Base16-Ocean-light</a></li>
            <li><a class="styleswitch code-base16-ocean-dark" href="?prism-base16-ocean.dark.css" title="code-base16-ocean-dark">Base16-Ocean-dark</a></li>
            <li><a class="styleswitch code-base16-paraiso-light" href="?prism-base16-paraiso.light.css" title="code-base16-paraiso-light">Base16-Paraiso-light</a></li>
            <li><a class="styleswitch code-base16-paraiso-dark" href="?prism-base16-paraiso.dark.css" title="code-base16-paraiso-dark">Base16-Paraiso-dark</a></li>
            <li><a class="styleswitch code-base16-pop-light" href="?prism-base16-pop.light.css" title="code-base16.pop.light">Base16-Pop-light</a></li>
            <li><a class="styleswitch code-base16-pop-dark" href="?prism-base16-pop.dark.css" title="code-base16-pop.dark">Base16-Pop-dark</a></li>
            <li><a class="styleswitch code-base16-railscasts-light" href="?prism-base16-railscasts.light.css" title="code-base16-railscasts-light">Base16-Railscasts-light</a></li>
            <li><a class="styleswitch code-base16-railscasts-dark" href="?prism-base16-railscasts.dark.css" title="code-base16-railscasts-dark">Base16-Railscasts-dark</a></li>
            <li><a class="styleswitch code-base16-shapeshifter-light" href="?prism-base16-shapeshifter.light.css" title="code-base16-shapeshifter-light">Base16-Shapeshifter-light</a></li>
            <li><a class="styleswitch code-base16-shapeshifter-dark" href="?prism-base16-shapeshifter.dark.css" title="code-base16-shapeshifter-dark">Base16-Shapeshifter-dark</a></li>
            <li><a class="styleswitch code-base16-solarized-light" href="?prism-base16-solarized.light.css" title="code-base16-solarized-light">Base16-Solarized-light</a></li>
            <li><a class="styleswitch code-base16-solarized-dark" href="?prism-base16-solarized.dark.css" title="code-base16-solarized-dark">Base16-Solarized-dark</a></li>
            <li><a class="styleswitch code-base16-summerfruit-light" href="?prism-base16-summerfuit.light.css" title="code-base16-summerfuit-light">Base16-Summerfuit-light</a></li>
            <li><a class="styleswitch code-base16-summerfruit-dark" href="?prism-base16-summerfuit.dark.css" title="code-base16-summerfuit-dark">Base16-Summerfuit-dark</a></li>
            <li><a class="styleswitch code-base16-tomorrow-light" href="?prism-base16-tomorrow.light.css" title="code-base16-tomorrow-light">Base16-Tomorrow-light</a></li>
            <li><a class="styleswitch code-base16-tomorrow-dark" href="?prism-base16-tomorrow.dark.css" title="code-base16-tomorrow-dark">Base16-Tomorrow-dark</a></li>
            <li><a class="styleswitch code-base16-londontube-light" href="?prism-base16-londontube.light.css" title="code-base16-londontube-light">Base16-London-Tube-light</a></li>
            <li><a class="styleswitch code-base16-londontube-dark" href="?prism-base16-londontube.dark.css" title="code-base16-londontube-dark">Base16-London-Tube-dark</a></li>
            <li><a class="styleswitch code-base16-twilight-light" href="?prism-base16-twilight.light.css" title="code-base16-twilight-light">Base16-Twilight-light</a></li>
            <li><a class="styleswitch code-base16-twilight-dark" href="?prism-base16-twilight.dark.css" title="code-base16-twilight-dark">Base16-Twilight-dark</a></li>

          </ul>
        </div>

        <!-- </div> -->
        <!-- /.row -->
      </div><!-- /.line .styleswitchers -->

      <!-- Main Content Section -->
      <!-- This has been source ordered to come first in the markup (and on small devices) but to be to the right of the nav on larger screens -->
      <article class="article article--demo">
        <div class="inner-wrap" id="wrap">

          <h2 class="project-title" id="about-prism">Prism <small>colorschemes</small></h2>
          <p><a href="http://prismjs.com/">Prism</a> is a lightweight, robust, elegant syntax highlighting library. It is written in javascript, and the colorschemes are CSS stylesheets; so highly customisable.</p>


          <div class="section-container auto" data-section>
            <section id="html-highlighting" class="language-markup">
              <p class="title" data-section-title><a href="#panel1">HTML</a></p>
              <div class="content" data-section-content>
                <!-- more about code markup and syntax highlighting on prismjs.com/#basic-usage -->
                <!--http://www.elliotswan.com/postable/-->
                <pre><code>
&lt;!-- main grid section --&gt;
&lt;div class=&quot;row&quot;&gt;
 &lt;div class=&quot;large-4 columns&quot;&gt;
   &lt;div class=&quot;panel&quot;&gt;
     &lt;h5&gt;panel title&lt;/h5&gt;
     &lt;p&gt;this is a three columns grid panel with an arbitrary height.&lt;/p&gt;
   &lt;/div&gt;
 &lt;/div&gt;
 &lt;div class=&quot;large-6 columns&quot;&gt;
   &lt;div class=&quot;panel&quot;&gt;
     &lt;h5&gt;panel title&lt;/h5&gt;
     &lt;p&gt;this is a six columns grid panel with an arbitrary height. bacon ipsum dolor sit amet salami ham hock biltong ball tip drumstick sirloin pancetta meatball short loin.&lt;/p&gt;
   &lt;/div&gt;
 &lt;/div&gt;
 &lt;div class=&quot;large-3  columns&quot;&gt;
   &lt;div class=&quot;panel&quot;&gt;
                </code></pre>
              </div>
            </section>

            <section id="css-highlighting" class="language-markup">
              <p class="title" data-section-title><a href="#panel2">CSS</a></p>

              <div class="content" data-section-content>
                <pre><code class="language-css">
/* comment */
@media only screen {
footer {
  overflow: hidden;
  text-align: center;
  text-transform: uppercase;
}
footer ul {
  list-style: none;
  padding-left: 0;
}
.cf:before,
.cf:after {
  content: "";
  display: table;
}
.cf:after { clear: both; }
                </code></pre>
              </div>
            </section>

            <section id="javascript-highlighting" class="language-markup">
              <p class="title" data-section-title><a href="#panel3">Javascript</a></p>

              <div class="content" data-section-content>
                <pre><code class="language-javascript">
// comment
events : function () {
  var self = this;

  $(this.scope)
    .on(&#39;click.joyride&#39;, &#39;.joyride-next-tip, .joyride-modal-bg&#39;, function (e) {
      e.preventDefault();

      if (this.settings.$li.next().length &lt; 1) {
        this.end();
      } else if (this.settings.timer &gt; 0) {
        clearTimeout(this.settings.automate);
        this.hide();
        this.show();
        this.startTimer();
      } else {
        this.hide();
                </code></pre>

                <!--http://ahrengot.com/web-development/pretty-code/-->
              </div>
            </section>

            <section id="php-highlighting" class="language-markup">
              <p class="title" data-section-title><a href="#panel4">SVG</a></p>

              <div class="content" data-section-content>
                <pre class="language-markup svg-markup"><code class="language-markup">
&lt;!-- http://www.w3.org/html/logo/downloads/HTML5_Badge.svg --&gt;

&lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 512 512&quot;&gt;
  &lt;title&gt;HTML5 Logo Badge&lt;/title&gt;
  &lt;path fill=&quot;#E34F26&quot; d=&quot;M71,460 L30,0 481,0 440,460 255,512&quot;/&gt;
  &lt;path fill=&quot;#EF652A&quot; d=&quot;M256,472 L405,431 440,37 256,37&quot;/&gt;
  &lt;path fill=&quot;#EBEBEB&quot; d=&quot;M256,208 L181,208 176,150 256,150 256,94 255,94 114,94 115,109 129,265 256,265zM256,355 L255,355 192,338 188,293 158,293 132,293 139,382 255,414 256,414z&quot;/&gt;
  &lt;path fill=&quot;#FFF&quot; d=&quot;M255,208 L255,265 325,265 318,338 255,355 255,414 371,382 372,372 385,223 387,208 371,208zM255,94 L255,129 255,150 255,150 392,150 392,150 392,150 393,138 396,109 397,94z&quot;/&gt;
&lt;/svg&gt;

                </code></pre>
              </div>
            </section>

          </div><!-- /.selection-container (tabs) -->
          <p class="note">When clicking the style-switcher in the top right corner to quickly switch between colorschemes, you can get a feeling for how the different schemes look, and also explore how they behave in different language-code-syntax (, while clicking through the tabs in the different code examples &hellip;).</p>

          <p>Prism comes with six colorschemes:</p>
          <ol>
            <li><a href="https://raw.github.com/LeaVerou/prism/gh-pages/prism.css">Default Light</a></li>
            <li><a href="https://raw.github.com/LeaVerou/prism/gh-pages/prism-dark.css">Dark</a></li>
            <li><a href="https://raw.github.com/LeaVerou/prism/gh-pages/prism-funky.css">Funky</a></li>
            <li><a href="https://raw.github.com/LeaVerou/prism/gh-pages/prism-okaidia.css">Okaidia</a></li>
            <li><a href="https://raw.github.com/LeaVerou/prism/gh-pages/prism-twilight.css">Twilight</a></li>
            <li><a href="https://raw.github.com/LeaVerou/prism/gh-pages/prism-tomorrow.css">Tomorrow</a></li>
          </ol>

          <p> One can <a href="https://github.com/LeaVerou/prism">download those directly from Github.</a></p>

          <!-- /.row prism syntax highlight examples -->



          <h3 id="customising">Customising</h3>

          <p>Except for the six that come with Prism, this repo contains more colorschemes, collected (<i>stolen</i>) from elsewhere and further adapted (<i>tweaked</i>).</p>
          <p>When possible, backlinks to their origin, and information about their creators are included.</p>

          <ol>
            <li><a href="../assets/css/prism/prism-xonokai.css">Xonokai</a>,
            original scheme by <a href="http://moox.fr/">Maxime Thirouin</a>,
            <a href="https://github.com/MoOx/sass-prism-theme-base">colorscheme on Github </a></li>
            <li><a href="../assets/css/prism/prism-cbavota.css">CB</a>,
            original scheme by <a href="http://cbavota.bitbucket.org/syntax-highlighter/">C. Bavota</a></li>
            <li><a href="../assets/css/prism/prism-pojoaque.css">Pojoaque</a>,
            original scheme by <a href="http://web-cms-designs.com/ftopict-10-pojoaque-style-for-highlight-js-code-highlighter.html">Jason Tate</a></li>
          </ol>

          <h3 id="base16-schemes">Base16 Schemes</h3>
          <p>Colorschemes produced, and if not tributed to someone else, also made by <a href="http://chriskempson.com">Chris Kempson</a> with <a href="https://github.com/chriskempson/base16-builder">base16 builder</a>.
          </p>

          <ol>
            <li><a href="../assets/css/prism/prism-base16-3024.dark.css">Base16-3024</a>, original scheme by <a href="http://github.com/idleberg">Jan T. Sott</a></li>
            <li><a href="../assets/css/prism/prism-base16-apathy.dark.css">Base16-Apathy</a>, original scheme by <a href="http://github.com/janniks">Jannik Siebert</a></li>
            <li><a href="../assets/css/prism/prism-base16-ashes.dark.css">Base16-Ashes</a>, original scheme by <a href="http://github.com/janniks">Jannik Siebert</a></li>
            <li><a href="../assets/css/prism/prism-base16-bespin.dark.css">Base16-Bespin</a>, original scheme by <a href="http://github.com/idleberg">Jan T. Sott</a></li>
            <li><a href="../assets/css/prism/prism-base16-brewer.dark.css">Base16-Brewer</a>, original scheme by <a href="http://github.com/tpoisot">Timoth&#233;e Poisot</a></li>
            <li><a href="../assets/css/prism/prism-base16-bright.dark.css">Base16-Bright</a></li>
            <li><a href="../assets/css/prism/prism-base16-chalk.dark.css">Base16-Chalk</a></li>
            <li><a href="../assets/css/prism/prism-base16-colors.dark.css">Base16-Colors</a>, original scheme by <a href="http://clrs.cc">Adam Morse</a></li>
            <li><a href="../assets/css/prism/prism-base16-default.dark.css">Base16-Default</a></li>
            <li><a href="../assets/css/prism/prism-base16-eighties.dark.css">Base16-Eighties</a></li>
            <li><a href="../assets/css/prism/prism-base16-embers.dark.css">Base16-Embers</a>, original scheme by <a href="http://github.com/janniks">Jannik Siebert</a></li>
            <li><a href="../assets/css/prism/prism-base16-flat.dark.css">Base16-Flat</a></li>
            <li><a href="../assets/css/prism/prism-base16-google.light.css">Base16-Google</a>, original scheme by <a href="http://sethawright.com/">Seth Wright</a></li>
            <li><a href="../assets/css/prism/prism-base16-grayscale.dark.css">Base16-Grayscale</a>, original scheme by <a href="https://github.com/Alexx2">Alexandre Gavioli</a></li>
            <li><a href="../assets/css/prism/prism-base16-greenscreen.dark.css">Base16-Greenscreen</a></li>
            <li><a href="../assets/css/prism/prism-base16-harmonic16.dark.css">Base16-Harmonic16</a>, original scheme by <a href="http://github.com/janniks">Jannik Siebert</a></li>
            <li><a href="../assets/css/prism/prism-base16-hopscotch.dark.css">Base16-Hopscotch</a>, original scheme by <a href="http://github.com/idleberg">Jan T. Sott</a></li>
            <li><a href="../assets/css/prism/prism-base16-isotope.dark.css">Base16-Isotope</a>, original scheme by <a href="http://github.com/idleberg">Jan T. Sott</a></li>
            <li><a href="../assets/css/prism/prism-base16-marrakesh.dark.css">Base16-Marrakesh</a>, original scheme by <a href="https://github.com/Alexx2">Alexandre Gavioli</a></li>
            <li><a href="../assets/css/prism/prism-base16-mocha.dark.css">Base16-Mocha</a></li>
            <li><a href="../assets/css/prism/prism-base16-monokai.dark.css">Base16-Monokai</a>, original scheme by <a href="http://www.monokai.nl">Wimer Hazenberg</a></li>
            <li><a href="../assets/css/prism/prism-base16-ocean.dark.css">Base16-Ocean</a></li>
            <li><a href="../assets/css/prism/prism-base16-paraiso.dark.css">Base16-Paraiso</a>, original scheme by <a href="http://github.com/idleberg">Jan T. Sott</a></li>
            <li><a href="../assets/css/prism/prism-base16-pop.dark.css">Base16-Pop</a></li>
            <li><a href="../assets/css/prism/prism-base16-railscasts.dark.css">Base16-Railscasts</a>, original scheme by <a href="http://railscasts.com">Ryan Bates</a></li>
            <li><a href="../assets/css/prism/prism-base16-shapeshifter.dark.css">Base16-Shapeshifter</a>, original scheme by <a href="http://github.com/idleberg">Tyler Benziger</a></li>
            <li><a href="../assets/css/prism/prism-base16-solarized.dark.css">Base16-Solarized-dark</a>, original scheme by <a href="http://ethanschoonover.com/solarized">Ethan Schoonover</a></li>
            <li><a href="../assets/css/prism/prism-base16-solarized.light.css">Base16-Solarized-light</a>, original scheme by <a href="http://ethanschoonover.com/solarized">Ethan Schoonover</a></li>
            <li><a href="../assets/css/prism/prism-base16-summerfruit.dark.css">Base16-Summerfruit</a>, original scheme by <a href="http://christop.club/">Christopher Corley</a></li>
            <li><a href="../assets/css/prism/prism-base16-tomorrow.dark.css">Base16-Tomorrow</a></li>
            <li><a href="../assets/css/prism/prism-base16-londontube.dark.css">Base16-London-Tube</a>, original scheme by <a href="http://github.com/idleberg">Jan T. Sott</a></li>
            <li><a href="../assets/css/prism/prism-base16-twilight.dark.css">Base16-Twilight</a>, original scheme by <a href="http://hart-dev.com/">David Hart</a></li>
          </ol>

          <h3 id="atelier-schemes">Atelier Schemes</h3>
          <p>And then some more, made by <a href="http://atelierbramdehaan.nl">me, Bram de Haan</a> with <a href="https://github.com/chriskempson/base16-builder">base16 builder</a>. You can find them in the <a href="https://github.com/atelierbram/syntax-highlighting/tree/master/atelier-schemes/output/prism">prism folder, within the output folder of Atelier schemes</a>.</p>

          <ol>
            <li><a href="../assets/css/prism/prism-base16-atelierforest.light.css">Forest Light</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierforest.dark.css">Forest Dark</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierplateau.light.css">Plateau Light</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierplateau.dark.css">Plateau Dark</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierheath.light.css">Heath Light</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierheath.dark.css">Heath Dark</a></li>
            <li><a href="../assets/css/prism/prism-base16-ateliercave.light.css">Cave Light</a></li>
            <li><a href="../assets/css/prism/prism-base16-ateliercave.dark.css">Cave Dark</a></li>
            <li><a href="../assets/css/prism/prism-base16-ateliersulphurpool.light.css">Sulphurpool Light</a></li>
            <li><a href="../assets/css/prism/prism-base16-ateliersulphurpool.dark.css">Sulphurpool Dark</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierlakeside.light.css">Lakeside Light</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierlakeside.dark.css">lakeside Dark</a></li>
            <li><a href="../assets/css/prism/prism-base16-ateliersavanna.light.css">Savanna Light</a></li>
            <li><a href="../assets/css/prism/prism-base16-ateliersavanna.dark.css">Savanna Dark</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierseaside.light.css">Seaside Light</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierseaside.dark.css">Seaside Dark</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierestuary.light.css">Estuary Light</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierestuary.dark.css">Estuary Dark</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierdune.light.css">Dune Light</a></li>
            <li><a href="../assets/css/prism/prism-base16-atelierdune.dark.css">Dune Dark</a></li>
          </ol>

          <h3 id="#lab" class="mtm">Lab</h3>
          <ul>
            <li><a href="http://codepen.io/atelierbram/pen/JnbIt">Colorscheme Lab on CodePen</a></li>
            <li><a href="https://gist.github.com/atelierbram/6283373">Colorscheme Lab as Github Gist</a></li>
          </ul>


          <h3 id="external-links">External Links</h3>
          <ul>
            <li><a href="http://prismjs.com/">Prism Project site</a></li>
            <li><a href="http://prismjs.com/download.html">Download Prism</a></li>
            <li><a href="https://github.com/LeaVerou/prism">Prism at Github</a></li>
            <li><a href="https://twitter.com/prismjs">Prism on Twitter</a></li>
            <li><a href="http://lea.verou.me/">Lea Verou &#8211; personal website and blog<!--<i>(if anything, hover over the RSS-icon, right in the top navigation bar &hellip;, be amazed, and then subscribe to the feed &hellip;) </i>--></a></li>
            <li><a href="http://chriskempson.github.io/base16/">Base16 Colorschemes Preview</a></li>
            <li><a href="https://github.com/chriskempson/base16">Base16 on Github</a></li>
          </ul>

          <p><a href="#header" class="go-to-top sh-button"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="50px" height="50px" viewBox="0 0 50 50" enable-background="new 0 0 50 50" xml:space="preserve">
              <g id="outline-black">
              <path opacity="0.5" d="M25,3L3,34l12-1v13h20V33l12,1L25,3z"/>
              </g>
              <g id="inner-white">
              <polygon fill="#FFFFFF" points="42,31 25,7 8,31 18,30 18,44 32,44 32,30 	"/>
              </g>
            </svg><span class="up-arrow">&#11014;</span>
            <span class="visuallyhidden">Go to Top</span></a>
          </p>

        </div><!-- \.inner-wrap -->
      </article>


      <!-- Footer -->
      <footer class="page-footer">
        <div class="large-12 columns">
          <div class="row">
            <div class="large-8 columns">
              <p id="license" class="copyright">&copy; 2013 <a href="http://atelierbramdehaan.nl" class="underline">Atelier Bram de Haan</a>, Releases under <a href="http://atelierbram.mit-license.org" class="underline">MIT License</a></p>
            </div>
            <div class="large-4 columns">
              <a href="https://github.com/atelierbram/syntax-highlighting" class="sh-button">This repo on Github</a>
            </div>
          </div>
        </div>
      </footer>
    </div>

    <script src="../assets/js/vendor/prism.js" data-default-language="markup"></script>

    <script>
document.write('<script src=' +
    ('__proto__' in {} ? '../assets/js/vendor/zepto' : 'js/vendor/jquery') +
    '.js><\/script>')
    </script>


    <script src="../assets/js/foundation/foundation.min.js"></script>
    <script src="../assets/js/foundation/foundation.dropdown.min.js"></script>
    <script src="../assets/js/foundation/foundation.section.min.js"></script>
    <script>
$(document).foundation();
    </script>
    <script src="../assets/js/vendor/custom.modernizr.js"></script>
    <!-- <script src="../assets/js/app/styleswitcher.min.js"></script> -->
    <script src="../assets/js/app/styleswitcher.js"></script>

    <script>function insertTopborder() { $('<div class="rainbow-border"><span class="yellow-background"></span><span class="orange-background"></span><span class="red-background"></span><span class="magenta-background"></span><span class="violet-background"></span><span class="blue-background"></span><span class="cyan-background"></span><span class="green-background"></span></div>').insertBefore('#wrap'); } insertTopborder();</script>
    </body>
    </html>
